import React, { useState, useEffect, useRef } from 'react';
import { Link, useHistory } from 'react-router-dom';
export default function NotFound() {
  const [time, setTime] = useState(3);
  const timeRef = useRef(0); //定义定时器id
  const history = useHistory();
  // 开启和关闭定时器
  useEffect(() => {
    timeRef.current = window.setInterval(() => {
      setTime((time) => time - 1);
    }, 1000);
    return () => {
      clearInterval(timeRef.current);
    };
  }, []);
  // 判断跳转时间
  useEffect(() => {
    if (time === 0) {
      history.push('/home');
      clearInterval(timeRef.current);
    }
    return () => {};
  }, [time, history]);
  return (
    <div>
      你访问的页面不存在,{time}秒后跳转到<Link to="/home">首页</Link>
    </div>
  );
}
